<template>
 	<view class="history">
 		<view class="con2" v-for="v in goodsList" :key="v.tit">
 				<view class="shoptit">
 					<view class="store">{{v.src}}</view>
 					<view class="pay">{{v.state}}</view>
 				</view>
 				<view class="time">
 					{{v.time}}
 				</view>
 				<view class="invite">
 					{{v.type}}
 				</view>
 				<view class="good_list">
 					
 					<view class="goods_con">
 						<view class="content2">
 							<image :src="v.imgUrl"></image>
 							<view class="tit">
 								<view>
 									{{v.tit}}
 								</view>
 								<view>{{v.con}}</view>
 							</view>
 						</view>
 						<view class="pri_num">
 							<view class="pri">
 								￥{{v.pri}}.00
 							</view>
 							<view class="num">
 								共 {{v.num}} 件
 							</view>
 						</view>
 					</view>
 					<view @click="anotherList(v.tit)" style="display: flex;justify-content: flex-end;">
 						<view class="Anotherlist">
 							再来一单
 						</view>
 					</view>
 				</view>
 		</view>
 		
 		
 	</view>
 </template>
 
 <script>
 	export default {
 		data(){
 			return {
 				goodsList:[
 					{
 						src:'府城国际店',
 						time:'2021-07-25 12:07:25',
 						state:'待付款',
 						type:'自取',
 						imgUrl:'../../static/takrfood/3.png',
 						tit:'红茶拿铁',
 						con:'中杯/正常冰',
 						pri:18,
 						num:1
 				
 				}]
 			}
 		},
 		methods:{
 			anotherList(tit){
 				let num=1
 				this.$store.commit('order',{tit,num})
 				uni.switchTab({
 					url:`../order/order?tit=${tit}`
 				})
 			}
 		}
 	}
 </script>
 
 <style lang="less">
 	.history {
 		font-size: 26rpx;
 		background-color: #f5f5f5;
 		height: 975rpx;
 		padding: 60rpx 30rpx 195rpx 30rpx;	
 	}
 	.con2 {
 		width: 692rpx;
 		height: 455rpx;
 		background-color: #fff;
 		padding: 40rpx;
 		box-sizing: border-box;
 		border-radius: 20rpx;
 		.shoptit {
 			display: flex;
 			justify-content: space-between;
 			.store {
 				font-size: 30rpx;
 				
 			}
 			.pay {
 				color: #818181;
 			}
 			
 		}
 		.time {
 			color: #818181;
 			margin: 13rpx 0 20rpx 0;
 		}
 		.invite {
 			width: 70rpx;
 			height: 40rpx;
 			border: 1px solid #b29451;
 			line-height: 40rpx;
 			text-align: center;
 			color: #b29451;
 		}
 		.good_list {
 			.goods_con {
 				display: flex;
 				justify-content: space-between;
 				padding: 34rpx 0;
 				border-bottom: 1px solid #ebebeb;
 				.content2 {
 					display: flex;
 					image {
 						width: 88rpx;
 						height: 88rpx;
 					}	
 					.tit {
 						margin-left: 35rpx;
 						display: flex;
 						flex-direction: column;
 						justify-content: space-between;
 						& :first-child {
 							font-size: 30rpx;
 							}
 						& :last-child {
 							color: #818181;
 							}	
 					}
 				}
 				.pri_num {
 					display: flex;
 					flex-direction: column;
 					justify-content: space-between;
 					.pri {
 						font-size: 30rpx;
 					}
 					.num {
 						color: #818181;
 					}
 				}
 				
 				
 			}
 			
 		}
 		.Anotherlist {
 			width: 152rpx;
 			height: 56rpx;
 			border: 1px solid #007d5f;
 			color: #007d5f;
 			border-radius: 10rpx;
 			margin-top: 27rpx;
 			text-align: center;
 			line-height: 56rpx;
 		}
 		
 	}
 	
 </style>